<template>
	<view class="orderPage">
		<view class="newsInfo" v-if="hasorder">
			<van-divider contentPosition="center" customStyle="color: #1989fa;border-color: #1989fa;font-size: 18px;">
				{{ textInfo }}
			</van-divider>
		</view>
		<view class="newsInfo" v-if="haspay">
			<van-divider contentPosition="center" customStyle="color: #1989fa;border-color: #1989fa;font-size: 18px;">
				{{ orderpay }}
			</van-divider>
		</view>
		<view class="orderList" v-if="token">
			<order-list></order-list>
			
		</view>
		<view class="login" v-else >
			<button type="primary" @click="login">请先登录</button>
		</view>
		<!-- dialog -->
		<view class="dialog">
			<van-dialog
			  use-slot
			  title="输入溢价"
			  :show="dialogData.show"
			  
			  show-cancel-button
			  @close="close"
			  @cancel="onDiaClose"
			  @confirm="subDone"
			>
			  <van-cell-group>
			    <van-field
			      :value="dialogData.premium"
			      placeholder="请输入溢价"
			      border
				  type="digit"
			      @change="onMoneyChange"
				  
			    />
			  </van-cell-group>
			</van-dialog>
		</view>
	</view>
</template>

<script>
	import OrderList from "@/components/public/order/OrderList.vue"
	import BaoJia from "@/components/public/order/BaoJia.vue"
	export default {
		components: {
			OrderList,
			BaoJia,
		},
		data() {
			return {
				dialogData: {
					show: false,
					premium: "",
					orderid: "",
				},
				hasorder: false,
				haspay: false,
				textInfo:"",
				orderpay: "",
				
			}
		},
		computed: {
			token() {
				return this.$store.state.token
			},
			UserRole() {
				return this.$store.state.UserRole
			},
			innerTxt() {
				return this.textInfo
			},
			
		},
		onShow() {
			// this.getOrder()
		},
		methods: {
			// 获取用户是否有待支付的订单
			async getOrder(  ) {
				let self = this
				if(this.token) {
					let res = await this.$Request("POST", "/Index/indentlist",{ token: this.token, status: '3' })
					let ret = await this.$Request("POST", "/Index/indentlist",{ token: this.token, status: '6' })
					if(res.data.data ) {
						this.hasorder = true
						this.textInfo = `${res.data.data.length}笔订单待支付`
					} else if(ret.data.data){
						this.haspay = true
						this.orderpay = `${ret.data.data.length}笔订单待结算`
					}
						
				}
			},
			// 去登录
			login() {
				uni.switchTab({
					url: "/pages/my/my"
				})
			},
			// 点击tab
			onTabClick( e ) {
				// console.log(e);
			},
			// 关闭dialog
			close() {
				this.dialogData.show = false
				// this.dialogData.premium = ""
			},
			onDiaClose(e) {
				this.dialogData.show = false
				this.dialogData.premium = ""
				this.orderid = ""
				uni.showToast({
					title: "取消操作",
					icon: "loading"
				})
			},
			// 输入框变化
			onMoneyChange(e) {
				this.dialogData.premium = e.detail
				console.log(this.dialogData.premium);
			},
			// 接收orderid
			doneServer( orderid ) {
				this.orderid = orderid
				this.dialogData.show = true
				console.log( this.orderid );
			},
			// 提交完成订单
			async subDone() {
				let orderid = this.orderid
				let premium = this.dialogData.premium
				let self = this
				let ret = await self.$Request("POST",'/Index/orderfinish', { orderid, premium, token: self.token })
				if(ret.data.code == 202) {
					uni.showToast({
						title: "服务完成",
						icon: "success"
					})
					this.dialogData.show = false
					this.orderid = ""
					this.dialogData.premium = ""
				}
			},
		}
	}
</script>

<style scoped lang="scss">
	.login {
		padding-top: 30%;
		text-align: center;
		button {
			width: 400rpx;
		}
	}
</style>
